<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Document</title>
  </head>

  <body>
    <div id="app"></div>

    <script>
      console.log('begin...');
      // 1. 使用settimeout 模拟网路请求
      //
      //setTimeout(() => {
      // console.log('hello ,world');
      //}, 2000);

      // Promise 参数-> 函数(resolve, reject)
      // resolve, reject 本身又是函数
      //new Promise((resolve,reject)=>{
      //   doing
      //   resolve()
      //}).then(()=>{
      //
      //})

      //链式编程
      new Promise((resolve, reject) => {
        //1.第一次网络请求的代码
        setTimeout(() => {
          resolve();
        }, 1000);
      }).then(() => {
        // 第一次拿到结果的处理代码
        console.log('hello world');
        console.log('hello world');
        console.log('hello world');
        return new Promise((resolve, reject) => {
          // 第二次网络请求的代码
          setTimeout(() => {
            resolve();
          }, 1000);
        }).then(() => {
          // 第二次处理的代码
          console.log('hello vue');
          console.log('hello vue');
          console.log('hello vue');
          return new Promise((resolve, reject) => {
            // 第三次网络请求的代码
            setTimeout(() => {
              resolve();
            }, 1000);
          }).then(() => {
            // 第三次处理的代码
            console.log('hi');
            console.log('hi');
            console.log('hi');
          });
        });
      });
    </script>
  </body>
</html>
